{% import '../macros/icon.njk' as icon %}
<div class="row header">
    <form id="post" class="grid pdh20" method="post">
        <div class="column is-three-quarters">
            <input name="title" type="text" value="{{ selected.title }}">
            <input name="tags" type="text" value="{{ selected.tags }}">
            <div class="grid">
                <select name="language" class="column is-select is-one-quarter">
                    {% for language in languages %}
                        <option value="{{ language.code }}" {% if selected.language === language.code %} selected {% endif %}>{{ language.name }}</option>
                    {% endfor %}
                </select>
                 <select name="status" class="column is-select is-one-quarter mgl10">
                    <option value="DRAFT" {% if selected.status === 'DRAFT' %} selected {% endif %}>Draft</option>
                    <option value="PUBLISHED" {% if selected.status === 'PUBLISHED' %} selected {% endif %}>Published</option>
                    <option value="SYNCHRONIZED" {% if selected.status === 'SYNCHRONIZED' %} selected {% endif %}>Synchronized</option>
                </select>
            </div>
        </div>
        <div class="column is-one-quarters">
            <button id="view" class="button is-info">
                <span class="icon">{{ icon.svg('binoculars') }}</span>
            </button>
            <button id="save" class="button is-warning">
                <span class="icon">{{ icon.svg('hdd') }}</span>
            </button>
        </div>
    </form>
</div>
<div class="row content autoscroll-y">
    <textarea id="editor">{{ selected.markdown }}</textarea>
</div>
<div class="row footer">
    <p>footer (fixed height)</p>
</div>